{extend name="public/base" /}
{block name="css"}
<link rel="stylesheet" href="/static/lib/dplayer/DPlayer.min.css">
{/block}
{block name="title"}
{$videoTitle}--{$webInfo.webname}
{/block}
{block name="content"}
<div class="row">
    <div class="col-sm-12 col-md-8">
        <div class="page-header h3">{$videoList.title}</div>
        <div style="border: 5px #EEEEEE solid;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;">
            <div id="dplayer"></div>
        </div>
        <div class="article-list" style="margin-top: 10px;margin-left: 15px;margin-right: 15px;">
            <div class="row" style="background: #EEEEEE;border: 2px #DDDDDD solid;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;padding-top: 10px;">
            {volist name="videoLists" id="vo"}
            <div class="article-list-item col-sm-offset-1 col-sm-4">
                <a href="{:url('index/video/video', ['id' => $id, 'video_id' => $vo.id])}" class="title">{$vo.title}</a>
            </div>
            {/volist}
            </div>
        </div>
        <div class="clearfix"></div>
        <div class="article-comment">
            <div class="page-header"><b>相关评论</b></div>
            <div class="comment-content">
                <form action="#">
                    <input type="hidden" name="video_id" value="{$videoList.id}">
                    <input type="hidden" name="member_id" value="{:session('index.id')}">
                    <div class="form-group">
                        <textarea class="form-control" id="comment" name="content" rows="5" cols=""></textarea>
                    </div>
                    <div class="form-group pull-right">
                        <button type="submit" class="btn btn-primary" id="videoListComm">评论（请认真评论）</button>
                    </div>
                </form>
            </div>
            <div class="clearfix"></div>
            <div class="comment-list">
                {volist name="videoList.comments" id="vo"}
                <div class="comment-list-item">
                    <div class="info">{$vo.member.nickname}<small>{$vo.create_time}</small></div>
                    <div class="content">{$vo.content}</div>
                </div>
                {/volist}
            </div>
        </div>
    </div>
    <div class="col-sm-12 col-md-4">
        <div class="affix">
            <div class="page-header h3">推荐文章</div>
            <div class="topic-list">
                {volist name="topArticles" id="vo"}
                <div class="topic-list-item">
                    <a href="{:url('index/article/info', ['id' => $vo.id])}" class="title">{$vo.title}</a>
                </div>
                {/volist}
            </div>
        </div>
    </div>
</div>
{/block}

{block name="js"}
<script src="/static/lib/dplayer/DPlayer.min.js"></script>
<script>
    var dp = new DPlayer({
        container:$('#dplayer')[0],
        lang:'zh-cn',
        screenshot:true,
        video:{
            quality:[
                {
                    name:'流畅',
                    url:'{$videoList.url}',
                    type:'auto'
                },
                {
                    name:'标清',
                    url:'{$videoList.url}',
                    type:'auto'
                }
            ],
            defaultQuality:0
        }
    });

    $('#videoListComm').click(function () {
        var member_id = "{:session('index.id')}";
        if (!member_id) {
            layer.msg('请先登录', {
                icon:5,
                time:2000
            }, function () {
                location.href = "{:url('index/index/login')}";
            });
        }else {
            $.ajax({
                url:"{:url('index/video/comments')}",
                type:'post',
                data:$('form').serialize(),
                dataType:'json',
                success:function (data) {
                    if (data.code == 1) {
                        layer.msg(data.msg, {
                            icon:6,
                            time:2000
                        }, function () {
                            location.href = location.href;
                        });
                    }else {
                        layer.open({
                            title:'评论失败',
                            content:data.msg,
                            icon:5,
                            anim:6
                        });
                    }
                }
            });
        }
        return false;
    });
</script>
{/block}